//引入封装好的接口
import {userList,getCount} from '../../../request/api'

const state = {
    userlist:[],
    size:3,   //每页显示的条数
    page:1,   //页码
    count:0,  //总条数
}

const getters = {
    getUser(state){
        return state.userlist
    },
    //封装总条数
    getCount(state){
        return state.count
    }
}

const mutations = {
     REQ_LIST(state,payload){
         state.userlist = payload
     },
     REQ_COUNT(state,payload){
         state.count = payload
     },
     CHANGE_PAGE(state,payload){
         state.page = payload
     },
}

const actions = {
    //列表行动
    getUserAction(context){
        console.log(context,'行动对象');
        userList({
            size:context.state.size,
            page:context.state.page
        })
        .then(res=>{
            // console.log(res,'行动');
            if(res.code==200){
                /* 
                   逻辑判断：
                      当删除最后一条数据的时候重新调用接口出现了问题（非第一页）

                      如果它不是第一页而且属于页面的最后一条数据作为删除，这个时候要重新调取接口  
                          并且把page减去-1
                */
                let list = res.list?res.list:[]
                if(context.state.page!=1 && list.length==0){
                    // console.log('重复进入');
                    // //重新调用接口行动
                    // let page = context.state.page-1;
                    // context.commit("CHANGE_PAGE",page)
                    // // console.log(page,'页码');
                    // context.dispatch('getUserAction')
                    //优化之后  可以直接调用  修改页码的行动
                    context.dispatch("changePageAction",context.state.page-1)
                }

                //提交mutations
                context.commit('REQ_LIST',res.list?res.list:[])
            }
        })    
    },
    //获取总条数行动
    getCountAction({commit}){
        getCount()
        .then(res=>{
            console.log(res,'管理员的总条数');
            if(res.code==200){
                commit('REQ_COUNT',res.list[0].total)
            }
        })
    },
    //封装一个修改页码的行动
    changePageAction(context,payload){
        // console.log(payload,'changePageAction');
        //修改page
        context.commit('CHANGE_PAGE',payload)
        //重新调用列表接口
        // console.log(context,'context');
        context.dispatch('getUserAction')
    } 
}


export default {
    state,
    getters,
    mutations,
    actions,
    namespaced:true
}

/* 
前端分页如何操作？
一旦是有分页，那么条数和页码就是必传参数！！！
条数（size） 当前一页显示多少条数据 一般默认是20
size

页码（page） 根据总条数以及一页显示多少条算出到有多少页

现在总条数一共18条  size ：5 
size     page       返回数据    剩余条数
5          1           1-5         13
5          2           6-10        8
5          3           11-15       3
5          4           16-18        0
*/
